import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:open_settings/open_settings.dart';

import '../../js_config.dart';
import '../js_widget/js_image_view.dart';
import '../js_widget/js_style.dart';

void jsShowCountryDialog(BuildContext context, Function(String country) onTap) {
  List<String> list = JsApp.countrys;
  final height = ScreenUtil().screenHeight * 0.7;

  showDialog(
    context: context,
    barrierDismissible: true,
    useSafeArea: false,
    barrierColor: Colors.black.withOpacity(0.55),
    builder: ((context) {
      return Dialog(
        alignment: Alignment.bottomCenter,
        insetPadding: EdgeInsets.zero,
        backgroundColor: Colors.transparent,
        child: Container(
          width: double.infinity,
          height: height,
          decoration: jsShapeRound(radius: 26.r, color: Colors.white),
          child: Column(
            children: [
              Expanded(
                child: ListView.builder(
                  itemCount: list.length,
                  shrinkWrap: true,
                  padding: EdgeInsets.zero,
                  itemBuilder: (context, index) {
                    return InkWell(
                      onTap: () {
                        Navigator.pop(context);
                        onTap(list[index]);
                      },
                      child: Container(
                        width: double.infinity,
                        height: 90.r,
                        margin: EdgeInsets.only(left: 24.r, right: 24.r),
                        alignment: Alignment.center,
                        decoration: BoxDecoration(
                          border: Border(
                            bottom: BorderSide(
                              width: 0.5.r,
                              color: Color(0xFFCCCCCC).withOpacity(0.6),
                            ),
                            left: const BorderSide(width: 0, color: Colors.transparent),
                            top: const BorderSide(width: 0, color: Colors.transparent),
                            right: const BorderSide(width: 0, color: Colors.transparent),
                          ),
                        ),
                        child: Text(list[index], style: jsTextStyle(font: JsTextFont.October_Devanagari_Regular, fontColor: Colors.black, fontSize: 20.r)),
                      ),
                    );
                  },
                ),
              ),
              Container(
                height: 38.r,
                margin: EdgeInsets.fromLTRB(62.r, 10.r, 62.r, 10.r),
                clipBehavior: Clip.antiAlias,
                decoration: jsShapeRound(radius: 12.r, shadows: [
                  BoxShadow(offset: Offset(1.r, 1.r), blurRadius: 4.r, color: Color(0xFFC9C9C9)),
                ]),
                child: InkWell(
                  child: Stack(
                    alignment: Alignment.center,
                    children: [
                      jsImage('assets/image/ic_personal_item.png', width: double.infinity, height: double.infinity, fit: BoxFit.fill),
                      Text("Cancel", style: jsTextStyle(font: JsTextFont.PoetsenOne, fontColor: Colors.white, fontSize: 18.r)),
                    ],
                  ),
                  onTap: () {
                    if (Navigator.canPop(context)) {
                      Navigator.pop(context);
                    }
                  },
                ),
              ),
              Container(
                height: ScreenUtil().bottomBarHeight,
                color: const Color.fromRGBO(255, 255, 255, 1),
              ),
            ],
          ),
        ),
      );
    }),
  );
}

jsShowAvatarDialog(
  BuildContext context,
  Function(int index) onTap,
) {
  showDialog(
    context: context,
    barrierDismissible: true,
    useSafeArea: false,
    barrierColor: Colors.black.withOpacity(0.55),
    builder: ((context) {
      return Column(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          Dialog(
            alignment: Alignment.bottomCenter,
            backgroundColor: Colors.transparent,
            insetPadding: EdgeInsets.zero,
            child: Container(
              width: double.infinity,
              alignment: Alignment.bottomCenter,
              decoration: jsShapeRound(radius: 26.r, color: Colors.white),
              child: Column(
                children: [
                  InkWell(
                    child: Container(
                      width: double.infinity,
                      height: 93.r,
                      alignment: Alignment.center,
                      child: Text('Photo Library', style: jsTextStyle(font: JsTextFont.October_Devanagari_Regular, fontColor: Colors.black, fontSize: 20.r)),
                    ),
                    onTap: () {
                      if (Navigator.canPop(context)) {
                        Navigator.pop(context);
                      }
                      onTap(0);
                    },
                  ),
                  Container(width: double.infinity, height: 0.6.r, margin: EdgeInsets.symmetric(horizontal: 24.r), color: Color(0xFFCCCCCC).withOpacity(0.6)),
                  InkWell(
                    child: Container(
                      width: double.infinity,
                      height: 93.r,
                      alignment: Alignment.center,
                      child: Text('Camera', style: jsTextStyle(font: JsTextFont.October_Devanagari_Regular, fontColor: Colors.black, fontSize: 20.r)),
                    ),
                    onTap: () {
                      if (Navigator.canPop(context)) {
                        Navigator.pop(context);
                      }
                      onTap(1);
                    },
                  ),
                  Container(width: double.infinity, height: 0.6.r, margin: EdgeInsets.symmetric(horizontal: 24.r), color: Color(0xFFCCCCCC).withOpacity(0.6)),
                  InkWell(
                    child: Container(
                      width: double.infinity,
                      height: 93.r,
                      alignment: Alignment.center,
                      child: Text('Initial avatar', style: jsTextStyle(font: JsTextFont.October_Devanagari_Regular, fontColor: Colors.black, fontSize: 20.r)),
                    ),
                    onTap: () {
                      if (Navigator.canPop(context)) {
                        Navigator.pop(context);
                      }
                      onTap(2);
                    },
                  ),
                ],
              ),
            ),
          )
        ],
      );
    }),
  );
}

jsShowRequiresCameraDialog(BuildContext context) {
  showDialog(
    context: context,
    barrierDismissible: false,
    useSafeArea: false,
    barrierColor: Colors.black.withOpacity(0.55),
    builder: ((context) {
      return Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Container(
            width: 280.r,
            decoration: jsShapeRound(radius: 12.r, color: Colors.white, shadows: [
              BoxShadow(offset: Offset(2.r, 4.r), blurRadius: 4.r, color: Colors.black.withOpacity(0.2)),
            ]),
            child: Dialog(
              alignment: Alignment.center,
              backgroundColor: Colors.transparent,
              insetPadding: EdgeInsets.zero,
              child: Container(
                width: 280.r,
                decoration: jsShapeRound(radius: 12.r, color: Colors.white, shadows: [
                  BoxShadow(offset: Offset(2.r, 4.r), blurRadius: 4.r, color: Colors.black.withOpacity(0.2)),
                ]),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Padding(
                      padding: EdgeInsets.fromLTRB(30.r, 25.r, 30.r, 18.r),
                      child: Text('"JumpScape" requires your camera to shoot a profile picture.', textAlign: TextAlign.center, style: jsTextStyle(font: JsTextFont.PoetsenOne, fontColor: Color(0xFF050A32), fontSize: 18.r, height: 28.0 / 18)),
                    ),
                    Container(width: double.infinity, height: 0.5.r, color: Color(0xFFCCCCCC)),
                    Row(
                      children: [
                        Expanded(
                          child: InkWell(
                            child: Container(
                              height: 51.r,
                              alignment: Alignment.center,
                              child: Text('No', style: jsTextStyle(font: JsTextFont.PoetsenOne, fontSize: 18.r, fontColor: Color(0xFF9A9A9A))),
                            ),
                            onTap: () {
                              if (Navigator.canPop(context)) {
                                Navigator.pop(context);
                              }
                            },
                          ),
                        ),
                        Container(width: 0.5.r, height: 51.r, color: Color(0xFFCCCCCC)),
                        Expanded(
                          child: InkWell(
                            child: Container(
                              height: 51.r,
                              alignment: Alignment.center,
                              child: Text('Yes', style: jsTextStyle(font: JsTextFont.PoetsenOne, fontSize: 18.r, fontColor: Color(0xFF050A32))),
                            ),
                            onTap: () {
                              if (Navigator.canPop(context)) {
                                Navigator.pop(context);
                              }
                              OpenSettings.openAppSetting();
                            },
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          )
        ],
      );
    }),
  );
}

jsShowRequiresPhotoDialog(BuildContext context) {
  showDialog(
    context: context,
    barrierDismissible: false,
    useSafeArea: false,
    barrierColor: Colors.black.withOpacity(0.55),
    builder: ((context) {
      return Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Container(
            width: 280.r,
            decoration: jsShapeRound(radius: 12.r, color: Colors.white, shadows: [
              BoxShadow(offset: Offset(2.r, 4.r), blurRadius: 4.r, color: Colors.black.withOpacity(0.2)),
            ]),
            child: Dialog(
              alignment: Alignment.center,
              backgroundColor: Colors.transparent,
              insetPadding: EdgeInsets.zero,
              child: Container(
                width: 280.r,
                decoration: jsShapeRound(radius: 12.r, color: Colors.white, shadows: [
                  BoxShadow(offset: Offset(2.r, 4.r), blurRadius: 4.r, color: Colors.black.withOpacity(0.2)),
                ]),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Padding(
                      padding: EdgeInsets.fromLTRB(30.r, 25.r, 30.r, 18.r),
                      child: Text('"JumpScape"  requires your album to upload a profile picture.', textAlign: TextAlign.center, style: jsTextStyle(font: JsTextFont.PoetsenOne, fontColor: Color(0xFF050A32), fontSize: 18.r, height: 28.0 / 18)),
                    ),
                    Container(width: double.infinity, height: 0.5.r, color: Color(0xFFCCCCCC)),
                    Row(
                      children: [
                        Expanded(
                          child: InkWell(
                            child: Container(
                              height: 51.r,
                              alignment: Alignment.center,
                              child: Text('No', style: jsTextStyle(font: JsTextFont.PoetsenOne, fontSize: 18.r, fontColor: Color(0xFF9A9A9A))),
                            ),
                            onTap: () {
                              if (Navigator.canPop(context)) {
                                Navigator.pop(context);
                              }
                            },
                          ),
                        ),
                        Container(width: 0.5.r, height: 51.r, color: Color(0xFFCCCCCC)),
                        Expanded(
                          child: InkWell(
                            child: Container(
                              height: 51.r,
                              alignment: Alignment.center,
                              child: Text('Yes', style: jsTextStyle(font: JsTextFont.PoetsenOne, fontSize: 18.r, fontColor: Color(0xFF050A32))),
                            ),
                            onTap: () {
                              if (Navigator.canPop(context)) {
                                Navigator.pop(context);
                              }
                              OpenSettings.openAppSetting();
                            },
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          )
        ],
      );
    }),
  );
}
